import React from 'react';
import ReactDOM from 'react-dom';
import Bundle from './Bundle'
import {BrowserRouter as Router, Redirect, Route, Link} from 'react-router-dom'

import App1 from './App1'
import App2 from './App2'

// import loadApp1 from 'bundle-loader?lazy!./App1'
// import loadApp2 from 'bundle-loader?lazy!./App2'
//
// const App1 = (props)=> {
//     return <Bundle load={loadApp1}>
//         {(App1)=> {
//             return <App1 {...props}/>
//         }}
//     </Bundle>
// }
//
// const App2 = (props)=> {
//     return <Bundle load={loadApp2}>
//         {(App)=> {
//             return <App {...props}/>
//         }}
//     </Bundle>
// }

const App = ()=> {
    return (
        <Router>
            <div>
                <Link to="/a1">A1</Link>
                <div></div>
                <Link to="/a2">A2</Link>
                <Route path="/a1" component={App1}/>
                <Route path="/a2" component={App2}/>
            </div>
        </Router>
    );
}

ReactDOM.render(<App />, document.getElementById('root'));